<script lang="ts">
import {defineComponent} from 'vue'
import ListPage from "@/components/ListPage/index.vue";
import {SearchListParams, SearchListResult} from "@/components/ListPage/type";
import DynamicTable from "@/components/DynamicTable3/index.vue";
import {TableConfigItem} from "@/components/DynamicTable3/types";
import fileReq from "@/api/file";
import {ElMessage, ElMessageBox} from "element-plus";
import Edit from "@/views/shareFileManagement/Edit.vue";
import DynamicForm from "@/components/DynamicForm3/index.vue";
import {FormConfigItem} from "@/components/DynamicForm3/types";

export default defineComponent({
  name: "ShareFileManagement",
  components: {DynamicForm, Edit, DynamicTable, ListPage},
  data() {
    return {
      tableConfgList: [
        {
          label: '文件路径',
          prop: 'filePath'
        },
        {
          label: '结束时间',
          prop: 'entTime',
        },
        {
          label: '操作',
          slotName: 'caozuo',
          align: 'center'
        },
      ] as TableConfigItem[],
      formData: {} as any,
      formConfigList: [
        {
          type: 'input',
          label: '文件路径',
          prop: 'filePath',
          search: true,
          props: {
            clearable: true,
          }
        },
        {
          type: 'rangDatePicker',
          props:{
            type: 'datetime',
            valueFormat: 'YYYY-MM-DD HH:mm:ss'
          },
          label: '结束时间',
          prop: 'entTimeStart',
          prop2: 'entTimeEnd',
          search: true,
        },
      ] as FormConfigItem[],
    }
  },
  methods: {
    searchList(search:SearchListParams):Promise<SearchListResult> {
      return fileReq.shareFileList({
        ...search,
        ...this.formData
      }).then(res => {
        return {
          list: res.data.records,
          total: res.data.total,
        }
      })
    },
    deleteRow(row){
      ElMessageBox.confirm('是否删除？','删除',{
        type: 'warning'
      }).then(()=>{
        fileReq.shareFileDelete([row.shareFileId]).then(res=>{
          ElMessage.success(res.data as string)
          this.getList()
        })
      })
    },
    lookRow(row){
      this.$router.push({
        path: '/showShareFile/'+row.shareFileId
      })
    },
    getList() {
      this.$refs.ListPageRef.getList()
    },
    editRow(row){
      this.$refs.EditRef.open(row)
    },
    async resetGetList2(){
      await this.$refs.DynamicFormRef.resetFields()
      this.$refs.ListPageRef.resetGetList()
    }
  }
})
</script>

<template>
  <div class="app-container">
    <ListPage
      ref="ListPageRef"
      :search-list="searchList"
    >
      <template #search="{getList,resetGetList}">
        <DynamicForm
          v-model="formData"
          search
          ref="DynamicFormRef"
          :created-init-value="false"
          :form-config-list="formConfigList"
          @search="getList"
        >
          <el-form-item>
            <el-button
              type="primary"
              @click.stop="getList"
            >搜索</el-button>
            <el-button
              @click.stop="resetGetList2"
            >重置</el-button>
          </el-form-item>
        </DynamicForm>
      </template>
      <template #list="{listData,listHeight,loading}">
        <DynamicTable
          :data="listData"
          :created-init-value="false"
          :height="listHeight"
          :table-config-list="tableConfgList"
        >
          <template #caozuo_default="{row, column, $index,tableData}">
            <el-button
              type="primary"
              text
              @click.stop="editRow(row)"
            >编辑</el-button>
            <el-button
              type="danger"
              text
              @click.stop="deleteRow(row)"
            >删除</el-button>
            <el-button
              type="primary"
              text
              @click.stop="lookRow(row)"
            >查看分享</el-button>
          </template>
        </DynamicTable>
      </template>
    </ListPage>
    <Edit
      ref="EditRef"
      @success="getList"
    ></Edit>
  </div>
</template>

<style scoped lang="scss">

</style>
